import 'package:amoy_ticket/people/people_main/more_service/custom_widget/gradient_button.dart';
import 'package:amoy_ticket/people/people_main/more_service/custom_widget/turn_box.dart';
import 'package:flutter/material.dart';
import 'package:flutter_smart_dialog/flutter_smart_dialog.dart';

import '../../../../utils/custom_clipper/star_path_clipper.dart';
import '../../../../utils/custom_clipper/triangle_path_clipper.dart';
import 'custom_checkbox_test.dart';
import 'custom_paint_five.dart';
import 'gradient_circular_route.dart';

class CustomWidgetRoute extends StatefulWidget {
  const CustomWidgetRoute({super.key});

  @override
  State<CustomWidgetRoute> createState() => _CustomWidgetRouteState();
}

class _CustomWidgetRouteState extends State<CustomWidgetRoute> {
  double _turns = .0;

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(title: Text('自定义组件')),
      body: SingleChildScrollView(
        child: Column(
          children: [
            fiveStar(),
            three(),
            Text('组合现有组件'),
            GradientButton(
              child: Text('渐变背景按钮'),
              borderRadius: BorderRadius.circular(20),
              // width: 200,
              onPressed: () {
                SmartDialog.showToast('hello');
              },
            ),
            Text('自绘demo'),
            TurnBox(
              child: Icon(Icons.home),
              turns: _turns,
              speed: 500,
            ),
            TurnBox(
              child: Icon(Icons.accessible_sharp),
              turns: _turns,
              speed: 1000,
            ),
            ElevatedButton(
              onPressed: () {
                setState(() {
                  _turns += 0.5;
                });
                print(_turns.toString());
              },
              child: Text('开始旋转上面的icon'),
            ),
            CustomCheckboxTest(),
            CustomPaintFive(),
            GradientCircularProgressRoute(),
          ].map((e) => Column(children: [e, Divider()])).toList(),
        ),
      ),
    );
  }

  fiveStar() {
    return Row(
      mainAxisAlignment: MainAxisAlignment.spaceAround,
      children: [
        Text('长、宽为100的正方形切成的⭐️'),
        ClipPath(
            clipper: StarPathClipper(scale: 2.5),
            child: Row(
              children: [
                Container(
                  height: 100,
                  width: 50,
                  decoration: BoxDecoration(
                    color: Colors.red,
                    border: Border.all(color: Colors.red, width: 1),
                  ),
                ),
                Container(
                  height: 100,
                  width: 50,
                  decoration: BoxDecoration(
                    color: Colors.grey.shade300,
                    border: Border.all(color: Colors.red, width: 1),
                  ),
                ),
              ],
            ))
      ],
    );
  }

  three() {
    return Row(
      mainAxisAlignment: MainAxisAlignment.spaceAround,
      children: [
        Text('长、宽为50的正方形切成的三角形'),
        ClipPath(
          clipper: TrianglePathClipper(),
          child: Container(
            height: 50,
            width: 50,
            color: Colors.red,
          ),
        ),
      ],
    );
  }
}
